; (function () {
    const tab = document.querySelectorAll('.pages1');
    for (let i = 0; i < tab.length; i++) {
        tab[i].addEventListener('click', function (e) {
            e.preventDefault()
            document.querySelector('.pages1.active').classList.remove('active')
            e.target.classList.add('active')
        })
    }
    document.querySelector('.dingdan').addEventListener('click', function () {
        document.querySelector('.contain .right').style.display = 'none'
        document.querySelector('.contain .right1').style.display = 'block'
        document.querySelector('.contain .right1 .lists').style.display = 'block'
        document.querySelector('.right1 .list1').style.display = 'none'
        document.querySelector('.right1 .list3').style.display = 'none'
        document.querySelector('.right1 .list2').style.display = 'none'
        document.querySelector('.dingdan').style.color = '#27ba9b'
        document.querySelector('.dingdan').style.listStyle = 'disc'
        document.querySelector('.zhongxin').style.color = '#666'
        document.querySelector('.zhongxin').style.listStyle = 'none'
    })
    document.querySelector('.zhongxin').addEventListener('click', function () {
        document.querySelector('.contain .right').style.display = 'block'
        document.querySelector('.contain .right1').style.display = 'none'
        document.querySelector('.contain .dingdan').style.listStyle = 'none'

        document.querySelector('.zhongxin').style.color = '#27ba9b'
        document.querySelector('.zhongxin').style.listStyle = 'disc'
        document.querySelector('.dingdan').style.color = '#666'
    })
    document.body.addEventListener('click', function (e) {
        if (e.target.tagName === 'A') {
            e.preventDefault()
        }
    })
    const chanceses = document.querySelectorAll('.chances')
    for (let i = 0; i < chanceses.length; i++) {
        chanceses[i].addEventListener('click', function (e) {
            document.querySelector('.chances.active2').classList.remove('active2')
            e.target.classList.add('active2')
        })
    }
    const second = document.querySelector('.second')
    function times() {
        let num = 15
        let num1 = 59
        // second.innerHTML = `付款截止：${num1}分${num}秒`
        setInterval(function () {
            num--

            second.innerHTML = `付款截止：${num1}分${num}秒`
            if (num <= 0) {
                num1--
                num = 60
            }
        }, 1000)

    }
    times()
    document.querySelector('.pay').addEventListener('click', function () {

        location.href = 'xtx-personale-center.html'
    })
    // 待付款
    document.querySelector('.obligation').addEventListener('click', function () {
        document.querySelector('.contain .right1 .lists').style.display = 'none'
        document.querySelector('.right1 .list3').style.display = 'none'
        document.querySelector('.right1 .list2').style.display = 'none'
        document.querySelector('.right1  .list1').style.display = 'block'

    })
    //全部订单
    document.querySelector('.all').addEventListener('click', function () {
        document.querySelector('.right1 .list1').style.display = 'none'
        document.querySelector('.contain .right1 .lists').style.display = 'block'
        document.querySelector('.right1 .list2').style.display = 'none'
        document.querySelector('.right1 .list3').style.display = 'none'

    })
    //待发货
    document.querySelector('.deliver').addEventListener('click', function () {
        document.querySelector('.right1 .list1').style.display = 'none'
        document.querySelector('.right1 .list2').style.display = 'block'
        document.querySelector('.contain .right1 .lists').style.display = 'none'
        document.querySelector('.right1 .list3').style.display = 'none'

    })
    //待收货
    document.querySelector('.takeDelivery').addEventListener('click', function () {
        document.querySelector('.contain .right1 .lists').style.display = 'none'
        document.querySelector('.right1 .list1').style.display = 'none'
        document.querySelector('.right1 .list2').style.display = 'none'
        document.querySelector('.right1 .list3').style.display = 'block'
    })
    const allA = this.document.querySelectorAll('.bigcircle ')
    let index = 0
    const constance = document.querySelector('.exhibit')
    const incorrect = document.querySelector('.incorrect')
    const wrong = document.querySelector('.wrong')
    incorrect.addEventListener('click', function () {
        index++
        document.querySelector('.exhibit .min').style.left = -constance.offsetWidth * index + 30 * index + 'px'
        if (index > 3) {
            document.querySelector('.exhibit .min').style.left = 6 + 'px'
            index = 0
        }
        document.querySelector('.bigcircle.highlight').classList.remove('highlight')
        allA[index].classList.add('highlight')

    })

    wrong.addEventListener('click', function () {
        index++
        document.querySelector('.exhibit .min').style.left = -constance.offsetWidth * index + 30 * index + 'px'
        if (index > 3) {
            document.querySelector('.exhibit .min').style.left = 36 + 'px'
            index = 0
        }
        document.querySelector('.bigcircle.highlight').classList.remove('highlight')
        allA[index].classList.add('highlight')
    })
    document.querySelector('.remove').addEventListener('click', function () {
        document.querySelector('.remove1').style.opacity = 1
        document.querySelector('.remove2').style.opacity = 1
        document.querySelector('.remove1').style.zIndex = 99999
        document.querySelector('.remove2').style.zIndex = 99999
    })
    document.querySelector('.cuohao').addEventListener('click', function () {
        document.querySelector('.remove1').style.opacity = 0
        document.querySelector('.remove2').style.opacity = 0
        document.querySelector('.remove1').style.zIndex = -1
        document.querySelector('.remove2').style.zIndex = -1
    })
    document.querySelector('.btn').addEventListener('click', function (e) {
        if (e.target.tagName === 'A') {
            document.querySelector('.btn a.active').classList.remove('active')
            e.target.classList.add('active')
        }
    })
    document.querySelector('.removeFooter').addEventListener('click', function (e) {
        if (e.target.tagName === 'BUTTON') {
            document.querySelector('.remove1').style.opacity = 0
            document.querySelector('.remove2').style.opacity = 0
            document.querySelector('.remove1').style.zIndex = -1
            document.querySelector('.remove2').style.zIndex = -1
            document.querySelector('.item').style.display = 'none'
            document.querySelector('.head').style.display = 'none'
        }
    })
}())
